import React, { Component } from "react";
import { TabBar } from 'antd-mobile';
import {withRouter} from "react-router-dom";
import "./foot2.css"

class Xfooter extends Component {
    constructor(props,context) {
        super(props);
        this.state = {
            selectedTab: 'blueTab',
            hidden: false,
            fullScreen: true,
        };
    }

    onChangeTab(tabName) {
        this.setState({
          selectedTab: tabName,
        });
    }

    render() {
        return (
            <div className={this.state.fullScreen ? "XfooterOne" : "XfooterTwo"}>
                <TabBar
                    unselectedTintColor="#999999"
                    tintColor="#33A3F4"
                    barTintColor="white"
                >
                    <TabBar.Item
                        title="首页"
                        icon={{ uri: require('../../imgs/home0.png') }}
                        selectedIcon={{ uri: require('../../imgs/home1.png') }}
                        history={this.props.history}
                        selected={this.state.selectedTab === 'blueTab'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'blueTab',
                            });
                            this.props.history.push('/terran/home');
                        }}
                    >
                    </TabBar.Item>
                    <TabBar.Item
                        title="基金"
                        icon={{ uri: require('../../imgs/fund0.png') }}
                        selectedIcon={{ uri: require('../../imgs/fund1.png') }}
                        selected={this.state.selectedTab === 'blackTab'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'blackTab',
                            });
                            this.props.history.push('/terran/fund');
                        }}
                    >
                    </TabBar.Item>
                    <TabBar.Item
                        title="发布"
                        icon={{ uri: require('../../imgs/publish0.png') }}
                        selectedIcon={{ uri: require('../../imgs/publish1.png') }}
                        selected={this.state.selectedTab === 'redTab'}
                        onPress={() => {
                            var phoneNum=document.cookie.split(';')[0].split('=')[1];
                            if(phoneNum==="null"||document.cookie===''){
                                alert('您还没有登录！');
                                this.setState({
                                    selectedTab: 'yellowTab',
                                });
                                this.props.history.push('/terran/my');
                            }else{
                                this.setState({
                                    selectedTab: 'redTab',
                                });
                                this.props.history.push('/terran/publish');
                            }
                        }}
                    >
                    </TabBar.Item>
                    <TabBar.Item
                        title="消息"
                        badge='99+'
                        icon={{ uri: require('../../imgs/message0.png') }}
                        selectedIcon={{ uri: require('../../imgs/message1.png') }}
                        selected={this.state.selectedTab === 'greenTab'}
                        onPress={() => {
                            var phoneNum=document.cookie.split(';')[0].split('=')[1];
                            if(phoneNum==="null"||document.cookie===''){
                                alert('您还没有登录！');
                                this.setState({
                                    selectedTab: 'yellowTab',
                                });
                                this.props.history.push('/terran/my');
                            }else{
                                this.setState({
                                    selectedTab: 'greenTab',
                                });
                                this.props.history.push('/terran/message');
                            }
                        }}
                    >
                    </TabBar.Item>
                    <TabBar.Item
                        title="我的"
                        icon={{ uri: require('../../imgs/me0.png') }}
                        selectedIcon={{ uri: require('../../imgs/me1.png') }}
                        selected={this.state.selectedTab === 'yellowTab'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'yellowTab',
                            });
                            var phoneNum=document.cookie.split(';')[0].split('=')[1];
                            if(phoneNum==="null"||document.cookie===''){
                                this.props.history.push('/terran/my');
                            }else{
                                this.props.history.push('/terran/myAfterLogin');
                            }
                        }}
                    >
                    </TabBar.Item>
                </TabBar>
            </div>
        );
    }
}
export default withRouter(Xfooter);